<%@include file="templates/header.jsp"%>

<style>
      <%@include file="../css/dhtmlxgrid_skins.css"%>
      <%@include file="../css/dhtmlxgrid_dhx_terrace.css"%>
        <%@include file="../css/dhtmlxgrid_dhx_skyblue.css"%>
         <%@include file="../css/dhtmlxgrid.css"%>
</style>
<script type="text/JavaScript" src=${dhtmlxcommon}></script>
	<script type="text/JavaScript" src=${dhtmlxgrid}></script>
    <script type="text/JavaScript" src=${dhtmlxgridcell}></script>

    <script type="text/JavaScript" src=${dhtmlxgrid_nxml}></script>

<script type="text/javascript">
var mygrid;
$(document).ready(
		function() {
			
			mygrid = new dhtmlXGridObject('mygrid_container');
// 			mygrid.setImagePath("codebase/imgs/");
			mygrid.setHeader("Nom de Ressource,Qty,Price");
			mygrid.setInitWidths("*,150,150");
			mygrid.setColAlign("left,right,right");
// 			mygrid.setSkin("light");
			mygrid.setSkin("light");

			mygrid.init();
			
			
			
		});
		
function addRow(){
    var newId = (new Date()).valueOf()
    mygrid.addRow(newId,"",mygrid.getRowsNum())
    mygrid.selectRow(mygrid.getRowIndex(newId),false,false,true);
}
function removeRow(){
    var selId = mygrid.getSelectedId()
    mygrid.deleteRow(selId);
}
</script> 


<div class="box">

	page d'affectation des ressources
	<h2></h2>

	<div id="mygrid_container" style="width:600px;height:150px;"></div>
<button onclick="addRow()">Add Row</button>  
  <button onclick="removeRow()">Remove Row</button>
</div>
</div>

<%@include file="templates/footer.jsp"%>